<template>
	<view>
		<nav-bar :title="pageTitle">
			<view slot="right">
				<!-- <view @click="jumpClick">实时数据</view> -->
			</view>
		</nav-bar>

		<view class="top-tab">
			<uni-segmented-control :current="current" :values="tabItemStr" style-type="text" active-color="#007aff" @clickItem="changeTab" />
		</view>


		<scroll-view class="scroll-view-box" scroll-y="true">
			<!-- <view class="content-params"> -->
			<view v-if="current == 0">
				<view v-if="docData.SearchPidData != null && docData.SearchPidData.length > 0">
					<view class="prop-colname">PID图纸</view>
					<view style="margin-top: 0upx;">
						<view v-for="(item,index) in docData.SearchPidData" :key="index" class="prop_col" @click="onSvgClick(item)">
							<text class="prop_title_h">
								{{item.Name}}
							</text>
							<text class="prop_value_h">
								{{item.FileName}}
							</text>
						</view>
					</view>
				</view>

				<view class="prop-colname">工艺参数</view>
				<view style="margin-top: 0upx;">
					<view v-for="(subitem,subindex) in workData" :key="subindex" class="prop_line">
						<text class="prop_title">
							{{subitem.propertyname}}
						</text>
						<text class="prop_value">
							{{subitem.provalue ? subitem.provalue : '--' }}
						</text>
					</view>
				</view>

				<view v-if="paramsData && paramsData.length > 0" class="prop-colname">扩展属性</view>
				<view v-if="paramsData && paramsData.length > 0" style="margin-top: 0upx;">
					<view v-for="(subitem,subindex) in paramsData" :key="subindex" class="prop_line">
						<text class="prop_title">
							{{subitem.propertyname}}
						</text>
						<text class="prop_value">
							{{subitem.provalue}}
						</text>
					</view>
				</view>
				
				<view v-if="isReal" class="real-btn" @click="jumpClick">查看实时数据</view>
			</view>

			<view v-if="current==1">
				<view style="margin-top: 0upx;">
					<view v-for="(item,index) in docData.docData" :key="index" class="prop_line" @click="onDocClick(item)">
						<text class="prop_title">
							{{item.FileName}}
						</text>
						<text class="prop_value">
							{{item.CreateTime}}
						</text>
					</view>
				</view>
			</view>

		</scroll-view>
	</view>
</template>

<script>
	import {
		getPropertyInfo,
		SearchAssociatedData,
		GetBitGId,
		GetModelData
	} from '@/services/index.js';
	
	import {
		mapState,
		mapMutations
	} from 'vuex';

	export default {
		updated() {
			// this.doRequestProperty();
		},
		mounted() {
			this.doRequestProperty();
			this.doRequestDocs();
			this.getModelData();
		},
		
		onLoad(e) {
			this.mileageID = e.mileageID
			this.bitNumber = e.bitNumber
		},

		data() {
			return {
				tabItemStr: ['属性', '文档'],
				current: 0,
				curTab: 'params',

				paramsData: {},
				workData: {},
				docData: {},
				
				pageTitle:'位号属性',
				
				mileageID:-1,
				bitNumber:"",
				
				isReal: false,
			}
		},
		methods: {
			...mapMutations(['setJumpToInstrumentBitNumber']),
			jumpClick(){
				this.setJumpToInstrumentBitNumber(this.bitNumber);

				uni.switchTab({
					url:"/pages/instrument/instrument?"
				})
			},
			
			changeTab(e) {
				if (this.current !== e.currentIndex) {
					this.current = e.currentIndex
				}
			},

			doRequestProperty() {
				getPropertyInfo({
					MileageID: this.mileageID,
					BitNumber: this.bitNumber
				}).then((res) => {
					if (res.code == '000000') {
						// this.paramsData = res.data;
						for (var i = 0; i < res.data.length; i++) {
							if (res.data[i].propertySetName == "扩展属性") {
								this.paramsData = res.data[i].DataList;
							} else if (res.data[i].propertySetName == "工艺参数") {
								this.workData = res.data[i].DataList;
							}
						}

					} else {

					}
					uni.hideLoading();
				});
			},
			
			getModelData() {
				GetModelData({
						glid: '',
						MileageID: this.mileageID,
						BitNumber: this.bitNumber
					})
					.then((res) => {
						if (res.code == '000000') {
							this.isReal = res.data.IsReal
						}
					})
			},
			

			doRequestDocs() {
				SearchAssociatedData({
					MileageID: this.mileageID,
					BitNumber: this.bitNumber
				}).then((res) => {
					if (res.code == '000000') {
						console.log("doRequestDocs")
						console.log(res.data)
						this.docData = res.data;
						if (this.docData.docData == null) {
							this.docData.docData = [{
								FileName: "暂无文件",
								CreateTime: "",
							}];
						}
					}
				});
			},

			doGetBitGId(item) {
				GetBitGId({
					MileageID: this.mileageID,
					BitNumber: this.bitNumber,
					CID: item.ID
				}).then((res) => {
					if (res.code == '000000') {
						let GId = res.data[0].GId;
						let Type = res.data[0].Type;
						uni.navigateTo({
							url: '/pages/drawing/drawingShow?url=' + item.FilePath + '&title=' + item.Name + "&GId=" + GId + "&Type=" +
								Type + "&BitNumber=" + this.bitNumber,
						})
					} else {
						uni.navigateTo({
							url: '/pages/drawing/drawingShow?url=' + item.FilePath + '&title=' + item.Name + "&BitNumber=" + this.bitNumber,
						})
					}
				});
			},

			onSvgClick(item) {
				this.doGetBitGId(item);
			}
		}
	}
</script>

<style lang="scss" scoped>
	.real-btn {
		background: #327FFC;
		border-radius: 50px;
		text-align: center;

		font-size: 36upx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: rgba(255, 255, 255, 0.85);
		line-height: 40upx;

		padding: 25upx;
		margin: 100upx 120upx;
		// position: absolute;
	}
	
	.top-tab {
		background: #fff;
		padding-top: 10px;
		box-shadow: 1upx 1upx 2upx 2upx rgba(0, 0, 0, 0.1);
	}
	
	.scroll-view-box {
		height: 85vh;
		background-color: #fff;
		display: flex;
		// position: absolute;
		flex-direction: row;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
	}
	
	.prop-colname {
		width: 100%;
		background-color: #dfdfdf;
		font-size: 16px;
		padding: 10upx;
		margin: 0;
	}



	.root-view {
		width: 220px;
		background-color: #ffffff;
	}

	.content-params {
		// top: 70upx;
	}

	.prop_col {
		// justify-content: space-between;
		display: flex;
		flex-direction: column;
		border-bottom-style: dotted;
		border-bottom-width: 4upx;
		border-bottom-color: #ffffff;
		padding: 20upx;
	}

	.prop_line {
		display: flex;
		flex-direction: row;
		border-bottom-style: dotted;
		border-bottom-width: 5upx;
		border-bottom-color: #efefef;
		padding: 20upx;
		align-items: center;
	}

	.prop_title_h {
		font-size: 32upx;
		color: rgba(0, 0, 0, 0.85);
		padding: 0;
		margin: 0;
		max-lines: 2;
		line-height: 40upx;
	}

	.prop_value_h {
		font-size: 32upx;
		color: rgba(0, 0, 0, 0.45);
		padding: 0;
		margin: 0;
		line-height: 40upx;
	}

	.prop_title {
		width: 40%;
		font-size: 32upx;
		color: rgba(0, 0, 0, 0.85);
		padding: 0;
		margin: 0;
		max-lines: 2;
		line-height: 40upx;
	}

	.prop_value {
		// align-items: flex-start;
		font-size: 32upx;
		color: rgba(0, 0, 0, 0.45);
		padding: 0;
		margin: 0;
		line-height: 40upx;
	}
</style>
